// subpkg_consult/medicine/timeline/index.scss
.timeline-page {
	padding-bottom: calc(env(safe-area-inset-bottom) + 60rpx);
}

.uni-map {
	width: 100%;
	height: 470px;
}

.navigator-bar {
	position: fixed;
	top: 10px;
	left: 10px;
	right: 10px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	border-radius: 4px;
	background-color: #fff;

	/* #ifdef APP */
	top: 25px;
	/* #endif */

	/* #ifdef MP-WEIXIN */
	height: 50px;
	top: 0;
	left: 0px;
	right: 0px;
	border-radius: 0;
	/* #endif */

	.icon-back {
		width: 16px;
		height: 16px;
		position: absolute;
		left: 0;
		padding: 14px;
	}
}

.timeline-meta {
	position: absolute;
	top: 380px;
	left: 10px;
	right: 10px;

	line-height: 1;
	padding: 15px 20px;
	border-radius: 4px;
	background-color: #fff;

	.status {
		font-size: 15px;
		color: #121826;
		font-weight: 500;
	}

	.extra {
		font-size: 14px;
		color: #6f6f6f;
		margin-top: 10px;

		// white-space: wrap;
	}
}

.timeline-detail {
	padding: 0 30rpx;

	.title {
		line-height: 1;
		padding: 40rpx 0;
		font-size: 30rpx;
		color: #121826;
		font-weight: 500;
	}

	.timeline {
		min-height: 300rpx;
		margin-left: 30rpx;
		margin-top: 20rpx;

		padding: 10rpx 60rpx 1rpx;
		border-left: 4rpx solid #16c2a3;
	}

	.line {
		margin-bottom: 30rpx;
		position: relative;
	}

	.badge {
		position: absolute;
		left: -92rpx;
		top: -10rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;

		&.text {
			color: #2cb5a5;
			font-size: 24rpx;
			background-color: #eaf8f6;
		}

		&.icon {
			background-color: #f6f7f9;
		}

		&.dot::before {
			content: '';
			display: block;
			width: 24rpx;
			height: 24rpx;
			background-color: #16c2a3;
			border-radius: 50%;
		}
	}

	.label {
		font-size: 32rpx;
		font-weight: 500;
		color: #6f6f6f;
		margin-bottom: 10rpx;
	}

	.content {
		color: #848484;
		font-size: 28rpx;
		margin-bottom: 10rpx;
	}

	.time {
		font-size: 28rpx;
		font-weight: 500;
		color: #6f6f6f;
	}
}
